
.wysiwyg-iframe-container {
    &.fallback {
        border-radius: var(--border-radius);
        overflow: hidden;
        background-color: var(--white-color);
    }
}

.note-editable blockquote {
    font-size: var(--font-size-base);
}

.note-editor {
    .note-toolbar.sticked {
        z-index: 1;
        position: fixed;
        background-color: @panel-bg;
    }

    &.panel > .panel-heading {
        .btn {
            padding-top: var(--4px);
            padding-bottom: var(--4px);
        }

        .dropdown-menu .btn-group > .btn {
            > i {
                top: var(--1px);
                position: relative;
            }
        }
    }

    .note-editing-area {
        ul,
        ol {
            margin-top: var(--line-height-computed-half);
            margin-bottom: var(--line-height-computed-half);

            &:first-child {
                margin-top: 0;
            }

            &:last-child {
                margin-bottom: 0;
            }
        }
    }
}

.panel.note-editor {
    margin-bottom: 0;

    .note-toolbar {
        border-bottom: 0 !important;
        background-color: transparent;

        > .btn-group {
            margin-bottom: var(--5px);
            .btn {
                margin-bottom: 0;

                height: var(--input-height-small);
            }
        }
    }

    &.panel-default {
        > .panel-heading .btn-default {
            background-color: var(--btn-default-bg) !important;
            border-color: var(--btn-default-border) !important;
        }
    }

    .panel-heading {
        padding: var(--5px) var(--5px) 0 var(--5px);
        min-height: calc(var(--30px)+ var(--10px));
    }

    .note-editable {
        min-height: var(--39px);

        table.bordered {
            &, th, td {
                border: var(--1px) solid;
            }
        }
    }

    &.note-frame {
        .note-editing-area {
            .note-editable {
                background-color: var(--input-bg);
                color: var(--input-color);

                &[contenteditable="false"] {
                    background-color: var(--text-color);
                }
            }
        }

        .note-statusbar {
            background-color: var(--input-bg);
            border-bottom-left-radius: var(--border-radius);
            border-bottom-right-radius: var(--border-radius);
            height: var(--8px);
        }

        output.note-status-output {
            padding-top: 0;
        }
    }
}

body .note-editor {
    .panel-heading {
        > .btn-group {
            right: 0;
            top: 0;

            > .btn {
                > i,
                > span {
                    position: relative;
                    top: var(--1px);
                }
            }

            > .btn-group {
                > .btn {
                    > i,
                    > span {
                        position: relative;
                        top: var(--1px);
                    }
                }
            }
        }
    }

    &.codeview {
        textarea.note-codable {
            min-height: var(--400px);
        }
    }

    .note-statusbar.locked {
        .note-resizebar {
            display: none;
        }
    }
}

.note-editor,
.wysiwyg-iframe-container {
    + .show-quote-button {
        padding: var(--1px) var(--4px);
        height: var(--14px);
        line-height: var(--4px);
        width: var(--26px);
    }
}

.note-editor {
    + .show-quote-button {
        position: relative;
        top: calc(var(--27px) * -1);
        left: var(--10px);
    }

    &.codeview {
        + .show-quote-button {
            display: none;
        }
    }

    &:has(+ .show-quote-button):not(.codeview) {
        .note-editable {
           padding-bottom: var(--26px);
        }
    }
}

